<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
	.first{
		background-color:#3F9}
</style>

<script language="javascript">

	function removeHead(){
		document.getElementById("account").value="";
	}
	
	function checkHead(){
		var str=document.getElementById("account").value;
		var str2=str.substr(0,2);
		if(str2!="10"||isNaN(str)){
			alert("输入格式错误");
			document.getElementById("account").value="";
		}	
	}
	
	function jisuan(){
		var pirce=document.getElementById("pirce").value;
		var num=document.getElementById("num").value;
		var res=pirce*num;
		document.getElementById("total").value=res;
	}
	
	function insert(){

		 //var newTR = document.getElementById("table1").insertRow(document.getElementById("table1").rows.length);
		  var newTR = document.getElementById("table1").insertRow(3);
            var newNameTD = newTR.insertCell(0);
            newNameTD.innerHTML = "aa";
            var newNameTD = newTR.insertCell(1);
            newNameTD.innerHTML = "qwqw";
            var newNameTD = newTR.insertCell(2);
            newNameTD.innerHTML = "10";
            var newNameTD = newTR.insertCell(3);
            newNameTD.innerHTML = "18";
			var newNameTD = newTR.insertCell(4);
            newNameTD.innerHTML = "180";
	}
	
	 function inserts() {
            var oTable = document.getElementById("table1");
            var oTr = oTable.insertRow();
            var oTd = oTr.insertCell();
            oTd.innerHTML = "新添加了一行";
        }
	
</script>

</head>

<body>

<form form="form1">
	<table>
    	<tr>
        	<td>账号：</td>
        	<td><input id="account" type="text" value="102222" onfocus="removeHead();" onblur="checkHead();"/></td>
        </tr>
        <tr>
        	<td>单价：</td>
        	<td><input id="pirce" type="text" value="25" readonly="readonly"/></td>
        </tr>
        <tr>
        	<td>数量：</td>
        	<td><input id="num" type="text" value="" onchange="jisuan();"/></td>
        </tr>
        <tr>
        	<td>总金额：</td>
        	<td><input id="total" type="text" value=""/></td>
        </tr>
    </table>
</form>

<form id="form2" style="text-align:center">
	<table id="table1" style="background-color:lightskyblue; margin:auto" border=1 cellpadding=0 cellspacing=0>
    	<tr bgcolor="#666666">
        	<td>账号：</td>
        	<td>密码：</td>
            <td>单价：</td>
        	<td>数量：</td>
        	<td>总金额：</td>
        </tr>
        <tr>
        	<td class="first">111111</td>
        	<td>111111</td>
            <td>10</td>
            <td>1</td>
            <td>10</td>
        </tr>
        <tr>
        	<td class="first" id="td2">222222</td>
        	<td>222</td>
            <td>10</td>
            <td>2</td>
            <td>20</td>
        </tr>
        <tr>
        	<td class="first" >abcdef</td>
        	<td>aaaaa</td>
            <td>10</td>
            <td>3</td>
            <td>30</td>
        </tr>
        <tr>
        	<td class="first">安静的承诺</td>
        	<td>a1as1</td>
            <td>10</td>
            <td>10</td>
            <td>100</td>
        </tr>
        
    </table>
   <input id="total" type="button" value="插入一行" onclick="insert();"/>
</form>

</body>
</html>
